<template id="search">
    <div>
        <div class="fen_l">
            <div class="fen_con">
                <img src="../image/search.jpg" alt="">
                <input type="text" placeholder="奇异果"  readonly="readonly" @click="getList()">
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        name:'search',
        methods:{
            getList:function(){
                this.$router.push('/searchFruits')
            }
        }
    }
</script>
<style>
    .fen_con{
        height:0.6rem;
        width:6.16rem;
        background:#e5e5e5;
        margin:0 0.12rem;
        border-radius:5px;
        position:relative;
    }
.fen_l{
    height:0.6rem;
    background:#f5f4f2;
    width:100%;
    padding:0.1rem 0;
}
.fen_con img{
    display:block;
    position:absolute;
    left: 2.5rem;
    top: 0.19rem;
    height:0.26rem;
    width:0.26rem;
}
    .fen_con input{
        display:block;
        border:0;
        height:0.6rem;
        position:absolute;
        background:none;
        outline:none;
        left:3rem;
        /*top:-0.05rem;*/
    }

    .fen_con  input::-webkit-input-placeholder{
             /* placeholder颜色  */
                      color: #8e8e8e;
            /* placeholder字体大小  */
                      font-size: 0.2rem;
            /* placeholder位置  */
                    /* line-height:0.55rem;*/
         }
</style>